import 'dart:io';

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:photo_view/photo_view.dart';

import '../bloc/image_preview_bloc.dart';
import '../bloc/image_preview_event.dart';
import '../bloc/image_preview_state.dart';

class ImagePreviewWidget extends StatefulWidget {
  const ImagePreviewWidget({super.key});

  @override
  _ImagePreviewWidgetState createState() => _ImagePreviewWidgetState();
}

class _ImagePreviewWidgetState extends State<ImagePreviewWidget>
    with AutomaticKeepAliveClientMixin {
  late ImagePreviewBloc bloc;

  @override
  void initState() {
    super.initState();
    if (kDebugMode) {
      print("ImagePreview: ImagePreviewWidget initState开始.");
    }
    bloc = ImagePreviewBloc();
    bloc.add(const InitialImageEvent());
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('左右滑动图片预览'),
        actions: [
          IconButton(
            icon: const Icon(Icons.save),
            onPressed: () async {},
          ),
        ],
      ),
      body: Stack(
        children: [
          // PageView 实现水平滑动
          PageView.builder(
            itemCount: 9,
            itemBuilder: (context, index) {
              return BlocBuilder<ImagePreviewBloc, ImageState>(
                bloc: bloc,
                builder: (BuildContext context, ImageState state) {
                  if (state is ImageLoadedState) {
                    return Stack(
                      children: [
                        PhotoView(
                          imageProvider: FileImage(File(state.filePath)),
                        ),
                        // 每个图片上的保存按钮
                        Positioned(
                          top: 40,
                          right: 20,
                          child: IconButton(
                            icon: Icon(Icons.save, color: Colors.white),
                            onPressed: () => saveTo,
                          ),
                        ),
                      ],
                    );
                  } else {
                    return buildLoading();
                  }
                },
              );
            },
            onPageChanged: (index) {
              bloc.switchImage(index);
            },
          ),
        ],
      ),
    );
  }

  Widget buildError(String error) {
    return Container(
      color: Colors.black, // 深色背景
      padding: const EdgeInsets.all(16),
      child: Center(
        child: Text(
          error,
          style: const TextStyle(
            color: Colors.white,
            fontSize: 16,
          ),
        ),
      ),
    );
  }

  Widget buildLoading() {
    return Container(
      color: Colors.black, // 深色背景
      child: const Center(
        child: CircularProgressIndicator(
          value: 1,
          valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
        ),
      ),
    );
  }

  void saveTo() {}

  @override
  bool get wantKeepAlive => true;
}
